<template>
  <div style="background-color: #FFFFFF;padding: 25px">
    <div>
      <div class="title">基本信息</div>
      <a-form-model layout="vertical" ref="ruleForm" :rules="rules" :model="formParam">
        <z-form-item :datas="fieldArr" :rules="rules" :form="formParam" :gutter="72"></z-form-item>
      </a-form-model>
    </div>
    <div>
      <div class="title">入职信息</div>
      <a-form-model layout="vertical" ref="ruleForm" :rules="rules" :model="formParam">
        <z-form-item :datas="fieldArr1" :rules="rules" :form="formParam" :gutter="72"></z-form-item>
      </a-form-model>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      formParam: {},
      fieldArr: [

        {label: '填报日期', prop: 'suspectAccountType', tagType: 'date-picker', span: 6},
        {label: '姓名', prop: 'suspectAccountName', tagType: 'input', span: 6},
        {label: '性别', prop: 'victimAccountType', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '出生日期', prop: 'suspectAccountType', tagType: 'date-picker', span: 6},
        {label: '籍贯', prop: 'vctimAccountNumber', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '身高（cm）', prop: 'transferTime', tagType: 'input', span: 6},
        {label: '体重', prop: 'transferMethod', tagType: 'input', span: 6},
        {label: '血型', prop: 'remittance', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '民族', prop: 'remit', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '政治面貌', prop: 'remit', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '健康状态', prop: 'remit', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '婚姻状态', prop: 'remit', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '文化程度', prop: 'remit', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '毕业院校', prop: 'ount', tagType: 'input', span: 6},
        {label: '专业', prop: 'ount', tagType: 'input', span: 6},
        {label: '毕业时间', prop: 'suspectAccountType', tagType: 'date-picker', span: 6},
        {label: '身份证号', prop: 'Amount', tagType: 'input', span: 6},
        {label: '居住地址', prop: 'tanceAmount', tagType: 'input', span: 6},
        {label: '户籍类型', prop: 'tanceAmount', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '户籍所在地', prop: 'tanceAmount', tagType: 'input', span: 6},
        {label: '本人联系电话', prop: 'tanceAmount', tagType: 'input', span: 6},
        {label: '本人电子邮箱', prop: 'tanceAmount', tagType: 'input', span: 6},
        {label: '紧急联系人姓名', prop: 'tanceAmount', tagType: 'input', span: 6},
        {label: '紧急联系人电话', prop: 'tanceAmount', tagType: 'input', span: 6},
        {label: '头像上传', prop: 'images', tagType: 'upload-image', bizPath: 'scott/pic'},
      ],
      fieldArr1:[
        {label: '入职时间', prop: 'suspectAccountType', tagType: 'date-picker', span: 6},
        {label: '职务', prop: 'tanceAmount', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '小组长', prop: 'tanceAmount', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '禁毒社区', prop: 'tanceAmount', tagType: 'dict-select', dictCode:'sex', span: 6},
        {label: '上传工作证', prop: 'tanceAmount', tagType: 'upload-file', span: 6},
      ],
      rules: {
        // 头像上传
        images: [
          { required: false, message: '请上传', trigger: 'change' },
        ],
        // 姓名
        suspectAccountName: [
          { required: true, message: '请输入', trigger: 'change' },
          { max: 15, message: '长度不能超过15个字符', trigger: 'change' }
        ],
      },
      optionsWithDisabled: [
        { label: '自愿戒毒', value: '1' },
        { label: '社区戒毒', value: '2' },
        { label: '社区康复', value: '3' },
        { label: '强制隔离戒毒', value: '4' },
        { label: '无', value: '5' },
      ],
      radioStyle: {
        display: 'block',
        height: '30px',
        lineHeight: '30px',
      }
    }
  },
  methods: {
    // 单选
    onChange(checkedList) {
      // let checkedData = this.checked ? this.funCheckedListData(1, this.checkedTemp, checkedList) : this.checkedTemp.filter(item => item!==this.curValue )
      // Object.assign(this, {
      //   checkedListData: checkedData, //合并或者过滤搜索原选中的值
      //   indeterminate: !!checkedList.length && checkedList.length < this.plainOptionsDatas.length,
      //   checkAll: checkedList.length === this.plainOptionsDatas.length,
      //   checkedTemp: checkedData  //作为临时数组
      // })
    },
    // 获取单选的选中状态和当前值
    onChangeCheck(e) {
      // this.checked = e.target.checked
      // this.curValue = e.target.value
    },
  }
}
</script>

<style scoped lang="less">
@import '~@assets/less/common.less';
.title{
  width: 100%;
  border-bottom: 1px solid #E9E9E9;
  margin-bottom: 25px;
  padding-bottom: 15px;
  font-size: 18px;
  font-weight: 600
}
.slots-checkbox{

  :deep(&.ant-checkbox-group) {
    .ant-checkbox-wrapper {
      display: flex;
      align-items: center;
      margin-bottom: 16px;
      margin-left: 0;
      .label {
        width: 200px;
        display: inline-block;
      }
      .ant-calendar-picker {
        width: 240px;
        flex: 0 0 240px;
      }
      .ant-select {
        flex: 0 0 200px;
      }
    }
  }
}
</style>
